body{
    font-family: "prog";
    margin: 0;
    background-color: #00101d;
}

header{
    background: fixed;
    background-color: #212121;
    padding: 10px;
}

.content_title{
    background-color:#343434 ;
    border-radius: 10px;
    text-align: center;
}

.title{
    margin: 0;
    border: 0;
}

.content_grid_link{
    margin-top: 10px;
    background-color: #212121;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-template-rows: 100px;
    grid-gap: 10px;
}
.content_div1{ grid-area: 1 / 1 / 2 / 2;}
.content_div2{ grid-area: 1 / 2 / 2 / 3;}
.content_div3{ grid-area: 1 / 3 / 2 / 4;}

.link_text{color: white;}

#content_div1, #content_div2, #content_div3{
    border-radius: 10px;
    border: none;
    text-align: center;
    align-items: center;
}

#content_div1{
    background-image: url(img/League-Wallpaper.jpg);
    background-position: 20% 0%;
    background-size: cover;
    filter: blur(5px);
    transition: filter 0.5s;
}

#content_div1:hover{
    filter: blur(0px);
}

#content_div3 {
    background-image: url('img/Ep8a1_Defiance_Playval.com_Act_Overview_banner_3440x1020_Darkbg.jpg');
    background-position: 20% 0%;
    background-size: cover;
    filter: blur(5px);
    transition: filter 0.5s;
}

#content_div3:hover {
    filter: blur(0px);
}

#content_div2 {
    background-image: url('img/wp2635077.jpg');
    background-position: 0% 25%;
    background-size: cover;
    filter: blur(5px);
    transition: filter 0.5s;
}

#content_div2:hover {
    filter: blur(0px);
}

.contain_page{
    padding: 20px;
    text-align: center; 
    color: #FFF;
    border-radius: 10px;
}

.title_page{
    font-size:xx-large;
    background: linear-gradient(to right, #785A28 45%, #C89B3C 55%);
    background-clip: text;
    color: transparent;
}

.contain_grid{
    border-radius: 10px;
    background-color: #343434;
    margin-top: 20px;
    text-align: left;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-template-rows: repeat(3, 1fr);
    grid-column-gap: 0px;
    grid-row-gap: 0px;
    height: 300%;
}

.image_div1{
    background-image: url(img/div_img1.webp);
    background-size: 150%;
    margin: 20px;
    border-radius: 10px;
}

#contain_p1, #contain_p2, #contain_p3{
    text-justify: auto;
}

.contain_p{
    margin-left: 10px;
    margin-right: 10px;
}

p{
    text-indent: 30px;
}

.image_div2{
    background-image: url(https://prod.assets.earlygamecdn.com/images/lol-lanes-explained.png?mtime=1644826397);
    background-size: 100%;
    margin: 20px;
    border-radius: 10px;
}

.image_div3{
    background-image: url(https://www.hotspawn.com/app/uploads/2018/11/lol_teamfight-1.jpg);
    background-size: 125%;
    margin: 20px;
    border-radius: 10px;
}

@font-face {
    font-family: 'prog';
    src: url(font_family/BeaufortForLoL-TTF/BeaufortforLOL-Bold.ttf);
    src: url(font_family/BeaufortForLoL-TTF/BeaufortforLOL-BoldItalic.ttf);
    src: url(font_family/BeaufortForLoL-TTF/BeaufortforLOL-BoldItalic\(1\).ttf);
    src: url(font_family/BeaufortForLoL-TTF/BeaufortforLOL-Heavy.ttf);
    src: url(font_family/BeaufortForLoL-TTF/BeaufortforLOL-HeavyItalic.ttf);
    src: url(font_family/BeaufortForLoL-TTF/BeaufortforLOL-Italic.ttf);
    src: url(font_family/BeaufortForLoL-TTF/BeaufortforLOL-Light.ttf);
    src: url(font_family/BeaufortForLoL-TTF/BeaufortforLOL-LightItalic.ttf);
    src: url(font_family/BeaufortForLoL-TTF/BeaufortforLOL-Medium.ttf);
    src: url(font_family/BeaufortForLoL-TTF/BeaufortforLOL-MediumItalic.ttf);
    src: url(font_family/BeaufortForLoL-TTF/BeaufortforLOL-Regular.ttf);
}